<template>
	<view class="content">
		<!-- 电量显示栏-->
		<view class="top_nav">
			<view class="kong"></view>
			<!-- <image src="../../static/buy/1.png"></image> -->
			<view class="tab_item">
				<view class="return" @click="return_btn">
					<image src="https://jialianxin-1301053941.cos.ap-chengdu.myqcloud.com/static/course/jiantou.png"></image>
				</view>
				<view class="title">意见反馈</view>
				<view class="return"></view>
			</view>
		</view>
		
		<view class="feedback">
			<view class="feedback_title">您有什么建议或者问题想对我们说？</view>
			<form @submit="submitForm">
				<view class="feedback_wrap">
					<view class="feedback_box">
						<textarea placeholder-style="font-size:28upx;" name="content" value="" placeholder="您的宝贵意见,是我们进步的源泉!" />
					</view>
				</view>
				<view class="feedback_btn">
					<button form-type="submit">提交问题</button>
				</view>
			</form>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				token:''
			}
		},
		onLoad(option) {
			this.token=option.token
		},
		methods: {
			//返回
			return_btn(){
				uni.navigateBack({
					delta:1
				})
			},
			submitForm(e){
				// console.log(e)
				
				let params={
						content:e.detail.value.content,
						token:this.token
					};
				var url ='/api/usercenter/feedback/add'
				this.Unfold_data.upload_data(params, 'POST', url, res => {
					// console.log(res);
					if (res.statusCode == 200 && res.data.code == 1) {
						// 成功跳转下载页面
						this.Unfold_data.showWindow(res.data.msg);
						if(res.data.code==1){
							setTimeout(function () {
								uni.navigateTo({
									url:'/pages/kefu/kefu'
								})
							 }, 1000);
						}
					} else {
						this.Unfold_data.showWindow(res.data.msg);
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	page{
		width: 100%;
		height: 100%;
		background: #41414d;
	}
	.content{
		width: 100%;
		position: relative;
		.top_nav{
			width: 100%;
			height: 200upx;
			background-image: url('https://jialianxin-1301053941.cos.ap-chengdu.myqcloud.com/static/buy/1.png');
			background-size: cover;
			position: fixed;
			top: 0;
			left: 0;
			z-index: 10;
			.kong{
				width: 100%;
				height: 60upx;
			}
			.tab_item{
				width: 90%;
				margin: 0 auto;
				height: 140upx;
				display: flex;
				align-items: center;
				justify-content: center;
				.return{
					flex: 1;
					width: 100%;
					image{
						width: 29upx;
						height: 29upx;
					}
				}
				.title{
					flex: 8;
					width: 100%;
					color: #ffffff;
					display: flex;
					align-items: center;
					justify-content: center;
					z-index: 10;
				}
			}
		}
		.feedback{
			width: 90%;
			margin: 0 auto;
			padding-top: 220upx;
			.feedback_title{
				margin-bottom: 20upx;
				color: var(--themeColor);
			}
			.feedback_wrap{
				width: 100%;
				height: 400upx;
				background: #FFFFFF;
				border-radius: 20upx;
				.feedback_box{
					width: 90%;
					margin: 0 auto;
					padding: 20upx 0;
					font-size:28upx;
				}
			}
			.feedback_btn{
				margin-top: 100upx;
				width: 100%;
				height: 90upx;
				background: linear-gradient(top,#ecdbb4,#a38348);
				button{
					background: none;
					border: none;
				}
			}
		}
	}
</style>
